<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('人工推单')" />
    <link th:href="@{/css/lobipanel.min.css}" rel="stylesheet" type="text/css"/>
</head>
<body class="gray-bg" id="manual">
    <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="order-form">
                    <div class="select-list">
                        <ul>
                            <li>
                                订单号：<input type="text" style="width:250px" name="searchValue" id="searchValue" th:value="${searchValue}"/>
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="queryOrder()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="col-sm-12 form-content" style="display:none">
                <form id="form-order-submit" class="form-horizontal">
                    <input name="id" type="hidden" id="id"/>
                    <div class="form-group form-group-sm">
                        <div class="col-sm-2 control-label">物流公司:</div>
                        <div class="col-sm-4">
                            <input type="text" name="wayBillEnt"  class="form-control" readonly required="true"/>
                        </div>
                        <div class="col-sm-2 control-label">物流运单号:</div>
                        <div class="col-sm-4">
                            <input type="text" name="wayBillNo" class="form-control" minlength="15" required="true"/>
                        </div>
                    </div>
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h4 class="panel-title">订单清关信息:<span style="color:#F00;" id="statusMsg"></span></h4>
                        </div>
                        <div class="panel-body">
                            <div class="col-sm-12">
                                <textarea id="body" name="body" rows="26" style="min-width: 100%; overflow-x: hidden" required="true"></textarea>
                            </div>
                            <div class="col-sm-offset-5 col-sm-10">
                                <button type="button" class="btn btn-sm btn-primary" onclick="clearRetry()"><i class="fa fa-check"></i>保 存</button>&nbsp;
                                <button type="button" class="btn btn-sm btn-danger" onclick="$.form.reset()"><i class="fa fa-reply-all"></i>关 闭 </button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script th:src="@{/js/jquery.min.js}" type="text/javascript"></script>
    <script th:src="@{/js/bootstrap.min.js}" type="text/javascript"></script>
    <script th:src="@{/js/jquery.fileDownload.min.js}" type="text/javascript"></script>
    <script th:src="@{/js/jquery-ui.min.js}" type="text/javascript"></script>
    <script th:src="@{/ajax/libs/layer/layer.min.js}" type="text/javascript"></script>
    <script th:src="@{/ajax/libs/filesaver/FileSaver.min.js?v=3.4.0}" type="text/javascript"></script>
    <script th:src="@{/ruoyi/js/ry-ui.js?v=3.4.2}" type="text/javascript"></script>
    <script th:src="@{/js/lobipanel.min.js}" type="text/javascript"></script>
    <script th:inline="javascript" type="text/javascript">
        var ctx = [[@{/}]]; 
        $(function () {
            var panelOpts = {
                maxHeight: 2480,
                unpin: false,
                expand: false,
                close: false,
                editTitle: false,
                changeStyle: false,
                reload: {
                    tooltip: '刷新'
                },
                minimize: {
                    icon: 'fa fa-chevron-up',
                    icon2: 'fa fa-chevron-down',
                    tooltip: '展开/收缩'
                }
            };
            $(".panel").each(function () {
                var that = $(this);
                that.lobiPanel(panelOpts);
            });
            
            var searchValue = $("#searchValue").val();
            if(searchValue){
                queryOrder();
            }
        });
        
        function clearRetry(){
            var body = $("#body").val().replace(/[\r\n]/g, '');
            var params = $.extend($.object.serialize($("#form-order-submit")) ||{}, {body:body});
            $.operate.asynPost(ctx + "customs/youzan/retry", params, function (data) {
                if(data){
                    if (data.msg) {
                        $.modal.msg(data.msg);
                    } else {
                        $.modal.msg("操作失败，请联系管理员");
                    }
                } else {
                        $.modal.msg("操作失败，请联系管理员");
                }
            });
        }
        
        function queryOrder() {
            $.operate.asynPost(ctx + "customs/youzan/query", $('#order-form').serialize(), function (data) {
                if (data) {
                    if (data.code == 0 && data.data) {
                        var that = $('div[class="col-sm-12 form-content"]');
                        if (that) {
                            that.css('display', 'block');
                        }
                        $('input[name="id"]').val(data.data.id);
                        if (data.data.statusMessage) {
                            $('#statusMsg').html(data.data.statusMessage);
                        }
                        if(data.data.wayBillEnt){
                            $("input[name='wayBillEnt']").val(data.data.wayBillEnt);
                        }
                        if(data.data.wayBillNo){
                            $("input[name='wayBillNo']").val(data.data.wayBillNo);
                        }
                        if (data.data.body) {
                            $('#body').html(JSON.stringify(data.data.body, null, 2));
                        }
                    } else {
                        $.modal.msg(data.msg);
                    }
                }
            });
        }
    </script>
</body>
</html>
